<template>
    <van-tabbar v-model="active" active-color="#FD7753" route>
        <van-tabbar-item v-for="item in tabArr" :to="`/${item.url}`">
            <span>{{item.name}}</span>
            <template #icon="props">
                <!-- <img src="../assets/img/home_icon_act.png" alt="" srcset=""> -->
                <img :src="props.active ? item.icon1 : item.icon" />
            </template>
        </van-tabbar-item>
    </van-tabbar>
</template>

<script>
    import home from '../assets/img/home_icon.png'
    import home1 from '../assets/img/home_icon_act.png'
    import job from '../assets/img/company_icon.png'
    import job1 from '../assets/img/company_icon_act.png'
    import mine from '../assets/img/mine_icon.png'
    import mine1 from '../assets/img/mine_icon_act.png'
    export default {
        data() {
            return {
                active: 0,
                tabArr:[
                    {
                        name:'首页',
                        url:'home',
                        icon:home,
                        icon1:home1,
                    },
                    {
                        name:'岗位',
                        url:'job',
                        icon:job,
                        icon1:job1,
                    },
                    {
                        name:'我的',
                        url:'mine',
                        icon:mine,
                        icon1:mine1,
                    }
                ]
            };
        },
    };
</script>

<style lang="scss" scoped>

</style>